<template>
  <div class="w header">
    <h1 class="title">E-charts可视化数据</h1>
    <span>{{curTime}}</span>
  </div>
</template>
<script>
export default {
  data () {
    return {
      curTime: ''
    }
  },
  mounted () {
    const vm = this
    setInterval(() => {
      vm.getCurTime()
    }, 1000)
  },
  methods: {
    getCurTime () {
      const t = new Date()
      console.log('t', t.getTime())
      const y = t.getFullYear()
      let m = t.getMonth() + 1
      if (m < 10) { m = '0' + m }
      let d = t.getDate()
      if (d < 10) { d = '0' + d }
      let h = t.getHours()
      if (h < 10) { h = '0' + h }
      let min = t.getUTCMinutes()
      if (min < 10) { min = '0' + min }
      let s = t.getSeconds()
      if (s < 10) { s = '0' + s }
      this.curTime = y + '年' + m + '月' + d + '日' + ' ' + h + '时' + min + '分' + s + '秒'
      console.log('this.curTime', this.curTime)
    }
  },
  computed: {
  }
}
</script>
<style scoped>
.header {
  position: relative;
  height: 1.25rem;
  text-align: center;
  background: url('../assets/images/head_bg.png')
}
.header .title {
  color: #fff;
  line-height: 1.25rem;
  font-size: .5rem;
}
.header span {
  position: absolute;
  top: 0;
  right: .25rem;
  font-size: .2125rem;
  line-height: 1rem;
  color: #fff;
}
</style>
